<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <!--<link rel="stylesheet" href="css/jkst-share.css">-->
    <style>
    	@charset "UTF-8";
/*!
*  Name: reset
*  Create: wangmingxin@1jd.com
*  Version : 1.0.0;
*  Date : 2017/09/20
*  If you use the _smartflex style ,please mark down and save the comment line!
*/
* {
  tap-highlight-color: transparent;
  -webkit-tap-highlight-color: transparent;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0;
  margin: 0;
  border: 0;
}

a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  vertical-align: baseline;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}

body {
  line-height: 1;
  font-family: "Microsoft YaHei", Arial, Helvetica, sans-serif;
  background: #f5f5f5;
}

ol,
li,
ul {
  list-style: none;
}

html {
  -webkit-text-size-adjust: 100%;
}

a,
div,
header,
span {
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
}

blockquote,
q {
  quotes: none;
}

blockquote:after,
blockquote:before,
q:after,
q:before {
  content: '';
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

input,
textarea {
  outline: 0;
  resize: none;
}

.clear {
  clear: both;
}

* {
  -webkit-tap-highlight-color: transparent;
}

body,
html {
  max-width: 750px;
  margin: 0 auto;
}

body {
  font-size: .6rem;
  background-color: #f8f8f8;
}

body,
input {
  margin: 0 auto;
  padding: 0;
  font-family: "PingFangSC-Regular", "Microsoft YaHei", "黑体", "宋体", sans-serif;
}

a,
div,
input,
textarea {
  outline: 0;
}

textarea {
  resize: none;
}

input,
textarea {
  appearance: button;
  -moz-appearance: button;
  -webkit-appearance: button;
}

#container {
  width: 100%;
}

a,
blockquote,
dd,
dl,
dt,
fieldset,
form,
h1,
h2,
h3,
h4,
h5,
h6,
li,
p,
span,
td,
th,
ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

dd {
  float: left;
  display: inline;
}

.clear,
dt.clear,
li.clear {
  clear: both;
  font-size: 0;
  height: 0;
}

dt.clear,
li.clear {
  height: 0;
  font-size: 0;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

abbr,
acronym,
fieldset,
img {
  border: 0;
}

address,
caption,
cite,
code,
dfn,
th,
var {
  font-weight: 400;
  font-style: normal;
}

caption,
th {
  text-align: left;
}

a {
  color: #404040;
  text-decoration: none;
}

.xg-commodity-price-old,
.xg-soldout,
.zs-price-red i {
  text-decoration: line-through;
}

a:hover {
  color: #333;
}

/*!
*  author: wangmingxin 201705040300
*  version "1.0.0";
*  If you use the -smartflex style ,please mark down and save the comment line!
*/
.smart-flex {
  display: -webkit-box !important;
  display: -webkit-flex !important;
  display: -ms-flexbox !important;
  display: flex !important;
}

.smart-flex.flex-wrap {
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.smart-flex.flex-v {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
}

.smart-flex.flex-v.reverse {
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
  -webkit-flex-direction: column-reverse;
  -ms-flex-direction: column-reverse;
  flex-direction: column-reverse;
}

.smart-flex.flex-v .flex-item {
  width: auto;
}

.smart-flex.flex-v > .flex-item > .flex-inbox {
  position: absolute;
  width: 100%;
  height: 100%;
}

.smart-flex.flex-h {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
}

.smart-flex.reverse {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -webkit-flex-direction: row-reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
}

.goods .name,
.info-txt,
.photos-detail-text-name,
.xg-commodity-text,
.zs-middle {
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
}

.smart-flex.justify-start {
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.smart-flex.justify-end {
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.smart-flex.justify-center {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.smart-flex.justify-between {
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.smart-flex.justify-around {
  -webkit-justify-content: space-around;
  -ms-flex-pack: distribute;
  justify-content: space-around;
}

.smart-flex.align-start {
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
}

.smart-flex.align-end {
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
  -ms-flex-align: end;
  align-items: flex-end;
}

.smart-flex.align-center {
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.smart-flex.align-stretch {
  -webkit-box-align: stretch;
  -webkit-align-items: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
}

.smart-flex.align-stretch .flex-item {
  height: auto !important;
}

.smart-flex.flex-center {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.smart-flex > .flex-item {
  position: relative;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  width: 0;
  -webkit-flex-basis: 0;
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
  max-width: 100%;
  display: block;
  padding: 0 !important;
}

.smart-flex > .flex-item.flex-fixed {
  -webkit-box-flex: 0 !important;
  -webkit-flex: none !important;
  -ms-flex: none !important;
  flex: none !important;
  width: auto;
}

.smart-flex > .flex-item.align-start {
  -webkit-align-self: flex-start;
  -ms-flex-item-align: start;
  align-self: flex-start;
}

.smart-flex > .flex-item.align-end {
  -webkit-align-self: flex-end;
  -ms-flex-item-align: end;
  align-self: flex-end;
}

.smart-flex > .flex-item.align-center {
  -webkit-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}

.smart-flex > .flex-item.align-stretch {
  -webkit-align-self: stretch;
  -ms-flex-item-align: stretch;
  align-self: stretch;
  height: auto !important;
}

.smart-flex > .flex-item-12 {
  -webkit-flex-basis: 100%;
  -ms-flex-preferred-size: 100%;
  flex-basis: 100%;
  max-width: 100%;
  width: auto !important;
}

.smart-flex > .order-12 {
  -webkit-box-ordinal-group: 13;
  -webkit-order: 12;
  -ms-flex-order: 12;
  order: 12;
}

.smart-flex > .flex-item-11 {
  -webkit-flex-basis: 91.66666667%;
  -ms-flex-preferred-size: 91.66666667%;
  flex-basis: 91.66666667%;
  max-width: 91.66666667%;
  width: auto !important;
}

.smart-flex > .order-11 {
  -webkit-box-ordinal-group: 12;
  -webkit-order: 11;
  -ms-flex-order: 11;
  order: 11;
}

.smart-flex > .flex-item-10 {
  -webkit-flex-basis: 83.33333333%;
  -ms-flex-preferred-size: 83.33333333%;
  flex-basis: 83.33333333%;
  max-width: 83.33333333%;
  width: auto !important;
}

.smart-flex > .order-10 {
  -webkit-box-ordinal-group: 11;
  -webkit-order: 10;
  -ms-flex-order: 10;
  order: 10;
}

.smart-flex > .flex-item-9 {
  -webkit-flex-basis: 75%;
  -ms-flex-preferred-size: 75%;
  flex-basis: 75%;
  max-width: 75%;
  width: auto !important;
}

.smart-flex > .order-9 {
  -webkit-box-ordinal-group: 10;
  -webkit-order: 9;
  -ms-flex-order: 9;
  order: 9;
}

.smart-flex > .flex-item-8 {
  -webkit-flex-basis: 66.66666667%;
  -ms-flex-preferred-size: 66.66666667%;
  flex-basis: 66.66666667%;
  max-width: 66.66666667%;
  width: auto !important;
}

.smart-flex > .order-8 {
  -webkit-box-ordinal-group: 9;
  -webkit-order: 8;
  -ms-flex-order: 8;
  order: 8;
}

.smart-flex > .flex-item-7 {
  -webkit-flex-basis: 58.33333333%;
  -ms-flex-preferred-size: 58.33333333%;
  flex-basis: 58.33333333%;
  max-width: 58.33333333%;
  width: auto !important;
}

.smart-flex > .order-7 {
  -webkit-box-ordinal-group: 8;
  -webkit-order: 7;
  -ms-flex-order: 7;
  order: 7;
}

.smart-flex > .flex-item-6 {
  -webkit-flex-basis: 50%;
  -ms-flex-preferred-size: 50%;
  flex-basis: 50%;
  max-width: 50%;
  width: auto !important;
}

.smart-flex > .order-6 {
  -webkit-box-ordinal-group: 7;
  -webkit-order: 6;
  -ms-flex-order: 6;
  order: 6;
}

.smart-flex > .flex-item-5 {
  -webkit-flex-basis: 41.66666667%;
  -ms-flex-preferred-size: 41.66666667%;
  flex-basis: 41.66666667%;
  max-width: 41.66666667%;
  width: auto !important;
}

.smart-flex > .order-5 {
  -webkit-box-ordinal-group: 6;
  -webkit-order: 5;
  -ms-flex-order: 5;
  order: 5;
}

.smart-flex > .flex-item-4 {
  -webkit-flex-basis: 33.33333333%;
  -ms-flex-preferred-size: 33.33333333%;
  flex-basis: 33.33333333%;
  max-width: 33.33333333%;
  width: auto !important;
}

.smart-flex > .order-4 {
  -webkit-box-ordinal-group: 5;
  -webkit-order: 4;
  -ms-flex-order: 4;
  order: 4;
}

.smart-flex > .flex-item-3 {
  -webkit-flex-basis: 25%;
  -ms-flex-preferred-size: 25%;
  flex-basis: 25%;
  max-width: 25%;
  width: auto !important;
}

.smart-flex > .order-3 {
  -webkit-box-ordinal-group: 4;
  -webkit-order: 3;
  -ms-flex-order: 3;
  order: 3;
}

.smart-flex > .flex-item-2 {
  -webkit-flex-basis: 16.66666667%;
  -ms-flex-preferred-size: 16.66666667%;
  flex-basis: 16.66666667%;
  max-width: 16.66666667%;
  width: auto !important;
}

.smart-flex > .order-2 {
  -webkit-box-ordinal-group: 3;
  -webkit-order: 2;
  -ms-flex-order: 2;
  order: 2;
}

.smart-flex > .flex-item-1 {
  -webkit-flex-basis: 8.33333333%;
  -ms-flex-preferred-size: 8.33333333%;
  flex-basis: 8.33333333%;
  max-width: 8.33333333%;
  width: auto !important;
}

.smart-flex > .order-1 {
  -webkit-box-ordinal-group: 2;
  -webkit-order: 1;
  -ms-flex-order: 1;
  order: 1;
}

.jkst-mating-list {
  width: 18.75rem;
}

.jkst-mating-item {
  padding: .5rem .4rem 0 .4rem;
  background-color: #fff;
  overflow: hidden;
  margin-bottom: .25rem;
}

.jkst-mating-item .jml-bottom-text {
  height: 2rem;
  line-height: 2rem;
  font-size: .6rem;
  color: #4A4A4A;
  clear: both;
}

.jkst-mating-item .jml-bottom-text .jmlb-text-left {
  float: left;
  max-width: 15rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.jkst-mating-item .jml-bottom-text .jmlb-text-left span {
  color: #9b9b9b;
}

.jkst-mating-item .jml-bottom-text .right-btn {
  float: right;
  height: 2rem;
  width: .7rem;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: 1.5rem .9rem;
  background-image: url("");
}

.jkst-mating-item .jkst-mating-img {
  position: relative;
  float: left;
  margin-left: .25rem;
  width: 7rem;
  height: 3.35rem;
  background-repeat: no-repeat;
  background-color: #EBEBEB;
  background-size: auto 50%;
  background-position: 50% 50%;
  background-image: url("");
}

.jkst-mating-item .jkst-mating-img .mating-goods-name {
  position: absolute;
  left: 0;
  bottom: .3rem;
  width: 100%;
  height: .7rem;
  line-height: .7rem;
  text-align: center;
  font-size: .6rem;
  color: #fff;
  z-index: 100;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.jkst-mating-item .jkst-mating-img img {
  width: 100%;
  height: 100%;
}

.jkst-mating-item .jkst-mating-img:after {
  position: absolute;
  bottom: 0;
  left: 0;
  content: "";
  display: inline-block;
  width: 100%;
  height: 2rem;
  opacity: 0.9;
  background-image: linear-gradient(360deg, #000000 0%, transparent 99%);
}

.jkst-mating-item .jkst-mating-img.big-img {
  margin-left: 0;
  width: 7.25rem;
  height: 10.25rem;
}

.jkst-mating-item .jkst-mating-img.big-img:after {
  height: 3rem;
}

.jkst-mating-item .jkst-mating-img.big-img .mating-goods-name {
  font-size: .7rem;
  bottom: .5rem;
}

.jkst-mating-item .little-goods-box {
  width: 10.5rem;
  display: inline-block;
}

.jkst-mating-item .little-goods-box > div:nth-child(1),
.jkst-mating-item .little-goods-box > div:nth-child(2) {
  margin-bottom: .25rem;
}

.jkst-mating-item .little-goods-box .jmi-text-box {
  width: 5rem;
  height: 5rem;
  float: left;
  margin-left: .25rem;
  text-align: center;
  color: #9b9b9b;
  font-size: .6rem;
  border: 1px solid #EBEBEB;
}

.jkst-mating-item .little-goods-box .jmi-text-box .text-row1,
.jkst-mating-item .little-goods-box .jmi-text-box .text-row2 {
  float: left;
  width: 5rem;
  margin-top: .3rem;
  line-height: .6rem;
  height: .6rem;
}

.jkst-mating-item .little-goods-box .jmi-text-box .text-row1 span,
.jkst-mating-item .little-goods-box .jmi-text-box .text-row2 span {
  color: #4A4A4A;
}

.jkst-mating-item .little-goods-box .jmi-text-box .text-btn-row {
  float: left;
  width: 5rem;
  margin-top: .6rem;
  height: 1rem;
  line-height: 1rem;
}

.jkst-mating-item .little-goods-box .jmi-text-box .text-btn-row .text-btn {
  display: inline-block;
  width: 1rem;
  height: 1rem;
  background-position: 50% 50%;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  background-image: url("");
}

.jkst-mating-item .little-goods-box .jmi-text-box .shop-name {
  float: left;
  width: 5rem;
  margin-top: .5rem;
  color: #4A4A4A;
}

.jkst-mating-item .jkst-mating-img.big-img.right {
  float: right;
}

.jkst-mating-item .little-goods-box.left {
  float: left;
  width: 10.5rem;
}

.jkst-mating-item .little-goods-box.left .jkst-mating-img,
.jkst-mating-item .little-goods-box.left .jmi-text-box {
  margin-left: 0;
  margin-right: .25rem;
}

.jkst-mating-item.portrait .little-goods-box .jmi-text-box {
  float: right;
  height: 10.25rem;
  margin-bottom: 0;
}

.jkst-mating-item.portrait .little-goods-box .jmi-text-box .shop-name {
  margin-top: 1.5rem;
}

.jkst-mating-item.portrait .little-goods-box .jmi-text-box .text-btn-row {
  margin-top: .5rem;
}

.jkst-mating-item.portrait .little-goods-box .jmi-text-box .text-row2 {
  margin-top: 3.75rem;
}

.jkst-mating-item.portrait .little-goods-box .jmi-text-box .text-row1 {
  margin-top: .5rem;
}

.jkst-mating-item.portrait .little-goods-box.left .jmi-text-box {
  float: left;
}

.jkst-mating-item.portrait .little-goods-box.left .jkst-mating-img {
  float: right;
}

.jkst-mating-item.transverse .little-goods-box .jmi-text-box {
  width: 10.25rem;
}

.jkst-mating-item.transverse .little-goods-box .jmi-text-box .text-row1,
.jkst-mating-item.transverse .little-goods-box .jmi-text-box .text-row2 {
  margin-top: 1rem;
}

.jkst-mating-item.transverse .little-goods-box .jmi-text-box .transverse-shop-row {
  float: left;
  width: 100%;
  height: 1rem;
  line-height: 1rem;
  margin-top: 1.4rem;
  text-align: center;
}

.jkst-mating-item.transverse .little-goods-box .jmi-text-box .transverse-shop-row .shop-name,
.jkst-mating-item.transverse .little-goods-box .jmi-text-box .transverse-shop-row .text-btn-row {
  width: auto;
  float: none;
  display: inline-block;
  margin-top: 0;
}

.jkst-mating-item.transverse .little-goods-box .jmi-text-box .transverse-shop-row .text-btn-row {
  vertical-align: middle;
}

.jkst-mating-item.goods-no1 .jkst-mating-img.big-img {
  width: 12rem;
  height: 8rem;
}

.jkst-mating-item.goods-no1 .jkst-mating-img.big-img:after {
  display: none;
}

.jkst-mating-item.goods-no1 .little-goods-box {
  width: 5.5rem;
}

.jkst-mating-item.goods-no1 .jmi-text-box {
  width: 5.5rem;
  height: 8rem;
  margin-bottom: 0;
}

.jkst-mating-item.goods-no1 .jmi-text-box .shop-name {
  width: 100%;
  margin-top: 1rem;
}

.jkst-mating-item.goods-no1 .jmi-text-box .text-btn-row {
  width: 100%;
}

.jkst-mating-item.goods-no1 .jmi-text-box .goods-name {
  float: left;
  margin-top: 1.3rem;
  width: 100%;
  font-size: .7rem;
  color: #4A4A4A;
}

.jkst-mating-item.goods-no1 .jmi-text-box .text-row1,
.jkst-mating-item.goods-no1 .jmi-text-box .text-row2 {
  width: auto;
  margin-top: 1rem;
}

.jkst-mating-item.goods-no1 .jmi-text-box .text-row1 {
  float: left;
  margin-left: .5rem;
}

.jkst-mating-item.goods-no1 .jmi-text-box .text-row2 {
  float: right;
  margin-right: .5rem;
}

.jkst-mating-item.goods-no2 .jkst-mating-img.big-img {
  width: 9rem;
  height: 9rem;
}

.jkst-mating-item.goods-no2 .little-goods-box {
  width: 8.5rem;
  height: 9rem;
}

.jkst-mating-item.goods-no2 .little-goods-box .jkst-mating-img {
  height: 5.4rem;
  width: 100%;
}

.jkst-mating-item.goods-no2 .little-goods-box .jkst-mating-img:after {
  display: none;
}

.jkst-mating-item.goods-no2 .jmi-text-box {
  width: 8.5rem;
  height: 3.25rem;
  margin-bottom: 0;
}

.jkst-mating-item.goods-no2 .jmi-text-box .text-row2,
.jkst-mating-item.goods-no2 .jmi-text-box .text-row1 {
  width: 4rem;
  margin-top: .5rem;
}

.jkst-mating-item.goods-no2 .jmi-text-box .shop-row {
  width: 100%;
  margin-top: .65rem;
  text-align: center;
  height: 1rem;
  float: left;
}

.jkst-mating-item.goods-no2 .jmi-text-box .shop-name,
.jkst-mating-item.goods-no2 .jmi-text-box .text-btn-row {
  display: inline-block;
  width: auto;
  margin-top: 0;
  float: none;
  vertical-align: middle;
}

.jkst-mating-list.v2 .jkst-mating-item {
  margin: .5rem auto;
  padding-top: 0;
  width: 17.35rem;
  background-color: #fff;
  border: .025rem solid #EBEBEB;
  border-radius: 5px;
  vertical-align: top;
}

.jkst-mating-list.v2 .jkst-mating-item .jml-bottom-text .right-btn {
  background-size: .5rem .5rem;
  background-image: url("");
}

.jkst-mating-list.v2 .jkst-mating-item .jkst-mating-img {
  border-radius: .1rem;
  overflow: hidden;
}

.jkst-mating-list.v2 .jmi-tittle {
  height: 1.8rem;
  line-height: 1.8rem;
}

.jkst-mating-list.v2 .jmi-tittle .jmi-tittle-left {
  float: left;
  font-size: .6rem;
  color: #4A4A4A;
}

.jkst-mating-list.v2 .jmi-tittle .floor-name {
  height: 1.8rem;
  line-height: 1.8rem;
  padding-left: .7rem;
  background-repeat: no-repeat;
  background-size: .55rem .7rem;
  background-position: left 50%;
  background-image: url("");
}

.jkst-mating-list.v2 .jmi-tittle .goods-name {
  margin-left: .5rem;
}

.jkst-mating-list.v2 .jmi-tittle .right-text {
  float: right;
  height: 1.8rem;
  line-height: 1.8rem;
  font-size: .5rem;
  color: rgba(0, 0, 0, 0.35);
}

.jkst-mating-list.v2 .jmi-tittle .right-text i {
  font-size: .8rem;
  color: #FF8680;
  font-weight: 900;
}

.jkst-mating-list.v2 .jkst-mating-img.big-img {
  width: 9.05rem;
  height: 7rem;
}

.jkst-mating-list.v2 .jkst-mating-img.big-img:after {
  height: 1.65rem;
}

.jkst-mating-list.v2 .little-goods-box {
  width: 7.3rem;
}

.jkst-mating-list.v2 .little-goods-box > div:nth-child(1) {
  width: 7rem;
  height: 3.35rem;
  margin-left: .3rem;
  margin-bottom: .3rem;
}

.jkst-mating-list.v2 .little-goods-box > div:nth-child(1):after {
  height: 1.65rem;
}

.jkst-mating-list.v2 .little-goods-box .jkst-mating-img {
  width: 3.35rem;
  height: 3.35rem;
  margin-left: .3rem;
  margin-bottom: 0;
}

.jkst-mating-list.v2 .little-goods-box .jkst-mating-img:after {
  height: 1.35rem;
}

.jkst-mating-list.v2 .little-goods-box.left > div:nth-child(1) {
  margin-left: 0;
  margin-right: .3rem;
}

.jkst-mating-list.v2 .little-goods-box.left .jkst-mating-img {
  margin-left: 0;
  margin-right: .3rem;
}

.jkst-mating-list.v2 .jkst-mating-item.goods-no3 .jkst-mating-img.big-img {
  width: 9.05rem;
  height: 7rem;
}

.jkst-mating-list.v2 .jkst-mating-item.goods-no3 .jkst-mating-img.big-img:after {
  height: 2.6rem;
}

.jkst-mating-list.v2 .jkst-mating-item.goods-no3 .little-goods-box {
  width: 7.3rem;
}

.jkst-mating-list.v2 .jkst-mating-item.goods-no3 .little-goods-box > div:nth-child(1) {
  width: 7.05rem;
  height: 3.4rem;
  margin-bottom: .3rem;
}

.jkst-mating-list.v2 .jkst-mating-item.goods-no3 .little-goods-box .jkst-mating-img {
  width: 7.05rem;
  height: 3.4rem;
  margin-bottom: 0;
}

.jkst-mating-list.v2 .jkst-mating-item.goods-no1 .jkst-mating-img.big-img {
  width: 100%;
  height: 7rem;
}

.jkst-mating-list.v2 .jkst-mating-item.goods-no1 .jkst-mating-img.big-img:after {
  display: inline-block;
  height: 2rem;
}

.jkst-mating-list.v2 .jkst-mating-item.goods-no2 .jkst-mating-img.big-img {
  width: 9.05rem;
  height: 7rem;
}

.jkst-mating-list.v2 .jkst-mating-item.goods-no2 .little-goods-box {
  width: 7.3rem;
  height: 7rem;
}

.jkst-mating-list.v2 .jkst-mating-item.goods-no2 .little-goods-box .jkst-mating-img {
  width: 7rem;
  height: 7rem;
  margin-bottom: 0;
}

.jkst-mating-list.v2 .jkst-mating-item.goods-no2 .little-goods-box .jkst-mating-img:after {
  display: inline-block;
}

.share-box {
  position: fixed;
  left: 50%;
  top: 0;
  width: 18.75rem;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
  transform: translateX(-50%);
}

.share-box .share-remind-text {
  margin: 2.4rem 0 1.2rem 0;
  height: .7rem;
  line-height: .7rem;
  text-align: center;
  color: #fff;
}

.share-box .share-main {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 17.75rem;
  transform: translateX(-50%) translateY(-50%);
  overflow: hidden;
}

.share-box .share-main .share-text {
  margin: .45rem 0 .45rem 0;
  padding: 0 .8rem;
  line-height: 1.4rem;
  font-size: .7rem;
  color: #c8c8c8;
}

.share-box .share-main .share-top-box {
  background-color: #fff;
  position: relative;
}

.share-box .share-main .share-top-box:before {
  content: "";
  display: table;
}

.share-box .share-main .share-top-box:after {
  position: absolute;
  left: 0;
  bottom: -.7rem;
  content: "";
  display: inline-block;
  width: 100%;
  height: .8rem;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url("");
  z-index: 100;
}

.share-box .share-main .jkst-mating-list.v2 {
  width: 100%;
}

.share-box .share-main .jkst-mating-list.v2 .jkst-mating-item {
  margin: 0 auto;
  border: none;
}

.share-box .share-main .jkst-mating-list.v2 .jkst-mating-item .jkst-mating-img:after {
  display: none;
}

.share-box .share-main .food-name-row {
  margin-top: .9rem;
  height: .8rem;
  line-height: .8rem;
  text-align: center;
  font-size: .8rem;
  color: #4A4A4A;
}

.share-box .share-main .share-time-row {
  margin-top: .9rem;
  padding: 0 .8rem;
  height: .7rem;
  line-height: .7rem;
}

.share-box .share-main .share-time-row .day-box:before,
.share-box .share-main .share-time-row .time-box:before,
.share-box .share-main .share-time-row .hot-text:before {
  content: "";
  display: inline-block;
  margin-right: .4rem;
  height: .7rem;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  vertical-align: top;
}

.share-box .share-main .share-time-row .day-box {
  color: #9b9b9b;
}

.share-box .share-main .share-time-row .day-box:before {
  width: .6rem;
  background-size: .6rem .6rem;
  background-image: url("");
}

.share-box .share-main .share-time-row .time-box {
  margin-left: 3rem;
  color: #C8C8C8;
}

.share-box .share-main .share-time-row .time-box.morning:before {
  width: .7rem;
  background-size: .7rem .6rem;
  background-image: url("");
}

.share-box .share-main .share-time-row .time-box.lunch:before {
  width: .7rem;
  background-size: .7rem .7rem;
  background-image: url("");
}

.share-box .share-main .share-time-row .time-box.dinner:before {
  width: .7rem;
  background-size: .7rem .7rem;
  background-image: url("");
}

.share-box .share-main .share-time-row .hot-text {
  float: right;
  color: #9b9b9b;
}

.share-box .share-main .share-time-row .hot-text:before {
  width: .5rem;
  background-size: .5rem .6rem;
  background-image: url("");
}

.share-box .share-main .share-bottom-box {
  margin-top: .6rem;
  background-color: #fff;
  height: 4rem;
}

.share-box .share-main .share-bottom-box:before {
  content: "";
  display: table;
}

.share-box .share-main .share-bottom-box .left-img-box {
  float: left;
  margin: .85rem 0 0 1.1rem;
  width: 2.5rem;
  height: 2.5rem;
}

.share-box .share-main .share-bottom-box .left-img-box img {
  width: 100%;
  height: 100%;
}

.share-box .share-main .share-bottom-box .right-text {
  margin-left: 4rem;
}

.share-box .share-main .share-bottom-box .right-text .text-row1 {
  margin-top: .85rem;
  height: .85rem;
  line-height: .85rem;
  font-size: .6rem;
  color: #4A4A4A;
}

.share-box .share-main .share-bottom-box .right-text .text-row2 {
  margin-top: .35rem;
  height: .7rem;
  line-height: .7rem;
  font-size: .5rem;
  color: #C8C8C8;
}

    </style>
</head>
<body>
    <div class="share-box">
        <div class="share-remind-text">长按保存图片，分享到您的朋友圈</div>
        <div class="share-main">
            <div class="share-top-box">
                <div class="share-text">记录点滴美食</div>
                <!--新的搭配样式 第五版-->
                <div class="jkst-mating-list v2">
                    <div class="jkst-mating-item">
                        <div class="jmi-img-box">
                            <div class="jkst-mating-img big-img">
                                <img src="img10.360buyimg.com/img/jfs/t2917/142/1827664368/46638/14be3e9b/57909b3eN1df0c453.jpg!cc_181x140" alt="">
                            </div>
                            <div class="little-goods-box">
                                <div class="jkst-mating-img">
                                  <img src="img10.360buyimg.com/img/jfs/t2917/142/1827664368/46638/14be3e9b/57909b3eN1df0c453.jpg!cc_181x140" alt="">
                                </div>
                                <div class="jkst-mating-img">
                                   <img src="img10.360buyimg.com/img/jfs/t2917/142/1827664368/46638/14be3e9b/57909b3eN1df0c453.jpg!cc_181x140" alt="">
                                </div>
                                <div class="jkst-mating-img">
                                   <img src="img10.360buyimg.com/img/jfs/t2917/142/1827664368/46638/14be3e9b/57909b3eN1df0c453.jpg!cc_181x140" alt=""> 
                                </div>
                            </div>
                        </div>
                     
                    </div>
                </div>
                <div class="food-name-row">台式卤肉饭 · 水焯西兰花 · 凉拌木耳</div>
                <div class="share-time-row">
                    <span class="day-box">2018-04-24</span>
                    <span class="time-box morning">早餐</span>
                    <span class="hot-text">337kcal</span>
                </div>
            </div>
            <div class="share-bottom-box">
                <div class="left-img-box">
                    <img src="" alt="">
                </div>
                <div class="right-text">
                    <div class="text-row1">-来自京东健康食堂·饮食分享</div>
                    <div class="text-row2">长按左侧二维码 查看详情</div>
                </div>            </div>
            <div class="close-btn"></div>
        </div>

    </div>
</body>
</html>